export default {
    data () {
      return {
        // 主键 默认id
        rowKey: 'id',
        // 数据数组
        dataSource: [],
        // 数据加载动画
        loading: false,
        // 分页器设置
        pagination: {
          total: 0,
          current: 1,
          pageSize: 10,
          showSizeChanger: true,
          showTotal: (total, range) => {
            return range[0] + '-' + range[1] + ' 共' + total + '条'
          }
        },
        // 查询参数
        queryParam: {},
        // 筛选参数字段
        filters: {},
        // 默认排序字段
        sortField: null,
        // 升序 asc/降序 desc
        sortOrder: null,
        // 表格展示
        tableShow: true,
        // 高级搜索 展开/关闭
        advanced: false,
        // 获取分页数据的方法
        getPage: function () {
        },
        // 删除 数据的方法
        delObj: function () {
        },
  
        // 表单页的title
        cardTitle: '',
        //表单初始化标识
        formInited: false,
  
        // 已选中数据集合
        selectedRows: [],
        // 已选中的数据主键集合
        selectedRowKeys: [],
        // 延迟加载，created时不主动加载数据
        lazyLoad: false,
        // 查询接口- 组件初始化时赋值
        getDataUrl:'',
        // 查询参数格式
        searchKey:'',
        // 搜索表单的布局
        searchFormLayout: {
          labelCol: {
            md: { span: 6 }
          },
          wrapperCol: {
            md: { span: 18 }
          },
        }
      }
    },
    created () {
      this.initDefaultSort()
    },
    mounted(){
      // 初始化渲染列表
      this.reloadTable()
    },
    methods: {
      /**
       * 默认排序规则
       */
      initDefaultSort(){
        this.sortField = 'id'
        this.sortOrder = 'desc'
      },
      /**
       * 表格重新加载方法
       * 如果参数为 true, 则强制刷新到第一页
       * @param bool
       */
      reloadTable (bool = false) {
        bool && (this.pagination.current = 1)
        this.loadData()
      },
      /**
       * 合并查询参数，分页参数，排序参数，过滤参数
       * @returns {{current: number, size: number} & {sortOrders: null, sortFields: null}}
       */
      pageParams: function () {
        let data =  {
          pageVo: {
            pageNumber: this.pagination.current,
            pageSize: this.pagination.pageSize,
          }
        }
        data[this.searchKey] = {...this.queryParam}
        return data
      },
      /**
       * 表格数据加载方法
       */
      loadData () {
        if (!this.getDataUrl) return false
        const params = this.pageParams()
        this.$http(this.getDataUrl, params).then(res => {
          this.dataSource = res.result.records;
          for(let i=0;i<this.dataSource.length;i++){
            this.dataSource[i].index = i+1
          }
          this.pagination.total = !isNaN(res.result.total) ? Number(res.result.total) : 0
        })
      },
      /**
       * 分页查询成功回调
       * @param page
       */
      onPageLoadSuccess(page){
        console.log(page)
      },
      /**
       * 分页、排序、筛选变化时进行数据更新
       * @param pagination
       * @param filters
       * @param sorter
       */
      handleTableChange (pagination, filters, sorter) {
        this.pagination = pagination;
        this.loadData()
      },
      // 展开/关闭 搜索条件
      toggleAdvanced () {
        this.advanced = !this.advanced
      },
      // 清空搜索条件
      resetSearchForm () {
        this.queryParam = {}
      },
      // 选择
      onSelectChange (selectedRowKeys, selectedRows) {
        this.selectedRowKeys = selectedRowKeys
        this.selectedRows = selectedRows
      },
      // 清空选项
      onClearSelected () {
        this.selectedRowKeys = []
        this.selectedRows = []
      },
  
      // 删除
      handleDel (record, url) {
        this.$http(url, {id:record.id}).then(res => {
          if (res.code === 200) {
            this.$message.success('删除成功！')
            // 删除成功后刷新列表
            this.loadData()
          }
        })
      },
  
      // ========== PageForm交互 ===================
      // TODO 支持 modal 形式表单
      // 切换表格/表单
      switchPage () {
        window.scrollTo(0, 0)
        this.tableShow = !this.tableShow
        if (!this.formInited) {
          this.formInited = true
        }
      },
      // 返回表格
      backToPage () {
        this.switchPage()
        this.reloadTable(false)
      },
      // 新增
      handleAdd (argument) {
        this.switchPage()
        this.cardTitle = '新增'
        this.$nextTick(function () {
          this.$refs.formPage.add(argument)
        })
      },
      // 编辑
      handleEdit (record, title) {
        this.switchPage()
        this.cardTitle = title || '修改'
        this.$nextTick(function () {
          this.$refs.formPage.update(record)
        })
      }
    }
  
  }
  